<template>
  <div class="content">
    <div class="myLine" style="float: left; width: 92%">
      <div class="c-title">{{ title }}</div>
      <div class="c-text" v-html="text" />
      <div class="c-bottom">
        <span class="section">{{ section }}</span>
        <span class="author">{{ author }}</span>
        <span class="time"> {{ time }}</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ['title', 'text', 'href', 'author', 'time', 'section']
  // data() {
  //   return {
  //     formatTime: ''
  //   }
  // },
  // mounted() {
  //   this.formatTime =
  //     this.time.getFullYear() + '-' + (this.time.getMonth() + 1) + '-' + this.time.getDate()
  // }
}
</script>

<style>
/*.flag{*/
/*  display:none*/
/*}*/
/*.myLine:hover{*/
/*  .flag{*/
/*    display:inline*/
/*  }*/
/*}*/
.content {
  padding-top: 20px;
  /*min-width: 650px;*/
  height: 130px;
}
.c-title {
  font-weight: 500;
  font-size: 18px;
  line-height: 28px;
  color: #212121;
  position: relative;
  vertical-align: middle;
  margin-bottom: 5px;
}
.c-title:hover {
  font-weight: bold;
  color: #6d9eeb;
  cursor: pointer;
}
.c-text {
  margin-bottom: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.5;
  color: #888;
  font-size: 15px;
  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC,
    Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei,
    sans-serif;
  line-height: 1.5;
}
.el-icon-star-on {
  display: inline-block;
  color: #6d9eeb;
  font-size: 16px;
}
.section {
  color: #888;
  font-size: 14px;
}
.author {
  color: #888;
  font-size: 14px;
  margin-left: 39px;
}
.collect {
  font-weight: bold;
  color: #6d9eeb;
}
.c-bottom {
  font-size: 14px;
}
.time {
  color: #9e9e9e;
  font-size: 12px;
}
</style>
